<template>
    <!-- 二维码下载app组件 -->
  <div id="wrap">
    <div class="qr-wrapper">
      <img class="erweima" src="../../../assets/imgs/qrcode.png" alt="">
    </div>
    <p class="line1">手机客户端</p>
    <p class="line2">扫码二维码下载</p>
    <p class="line3">
      <span class="iosLogo">
        <i class="iconfont iconsy_kehuduan_ios"></i>
      </span>
      <span class="iosText">IOS版</span>
      <span class="androidLogo">
        <i class="iconfont iconsy_kehuduan_android"></i>
      </span>
      <span class="androidText">安卓版</span>
    </p>
  </div>
</template>

<script>
export default {
    name: 'loadApp'
}
</script>

<style lang="stylus" scoped>
@import '~@/assets/styles/variables.styl'
  #wrap
    width 218px;
    height 280px;
    background-color #ffffff;
    border-top 6px solid #cca566;
    .qr-wrapper 
      width 160px 
      margin 0 auto 
      margin-top 20px 
      .erweima
        width 100%

    p.line1
      width 218px;
      text-align center;
      margin-top 12px;
      color #222836;
      font-size 15.14px;
    p.line2
      width 218px;
      text-align center;
      margin-top 0px;
      margin-bottom 8px;
      font-size 12.12px;
      color #8c8f98;
      margin-top 10px
    p.line3
      width 218px;
      font-size 0;
      height 17px;
      line-height 17px;
      .iosLogo
        margin-left 25px;
        margin-right 9px;
        //占位代码 删
        display inline-block;
        width 14px;
        height 16px;
        .iconfont 
          font-size 18px
          color $color-theme-red 
      .iosText
        font-size 14.13px;
        color #222836;
        margin-right 17px;
      .androidLogo
        margin-right 10px;
        display inline-block;
        width 16px;
        height 16px;
        .iconfont 
          font-size 16px 
          color $color-primary-blue
      .androidText
        font-size 14.13px;
        color #222836;

</style>